<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>timming-2:延迟执行</title>
</head>
<body>
<div id="message1"></div>

<div><input id="question"/></div>
<div><button id="btnAnswer">获取答案</button></div>
<div>
    <label>答案：</label><input  id="answer" value="loading......"/>
</div>


<div id="message3"></div>

</body>
<script>

     var btnAnswer = document.getElementById('btnAnswer');
     btnAnswer.onclick = function () {
         document.getElementById('message1').innerText = "message1";
         setTimeout(getAnswer,2000);// 延迟执行，耗时操作---- 异步操作; 不是逐步执行，而是跳步
        // clearTimeout(getAnswer)
         document.getElementById('message3').innerText = "message3";

     }
    function getAnswer() {
        var answer = document.getElementById('answer');
        answer.value="Here is the answer！"
    }


</script>
</html>